<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 1.内联转成内联块和块元素 -->
    <span style="background-color: aquamarine;">今天的天气很好</span>
    <span style="background-color: aquamarine;">明天可能会下雨</span>
    <hr>
    <span style="background-color: aquamarine;display: inline-block;width: 180px;">今天的天气很好</span>
    <span style="background-color: aquamarine;display: inline-block;width: 220px;">明天可能会下雨</span>
    <hr>
    <span style="background-color: aquamarine;display: block;width: 180px;">今天的天气很好</span>
    <span style="background-color: aquamarine;display: block;width: 220px;">明天可能会下雨</span>
    <!-- 2.块元素转成内联块和内联元素 -->
    <hr>
    <div style="background-color: bisque;display: inline;width: 180px;">星期一</div>
    <div style="background-color: beige;display: inline;width: 220px;">星期二</div>
</body>
</html>